<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:h="http://java.sun.com/jsf/html">
<head>
<link rel="stylesheet" type="text/css" href="./css/styles.css" />
</head>

<body>
  <div id="fb-root"></div>
  <script>
    //initializing API
    window.fbAsyncInit = function() {

      FB.init({
        appId: '542566145800581',
        status: true, 
        cookie: true,
        xfbml: true  });
    };

    (function() {
      var e = document.createElement('script'); 
      e.async = true;
      e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
      document.getElementById('fb-root').appendChild(e);
    }());


    //your fb logout function
    function fblogout() {
      FB.logout(function(response) {});

    }
  </script>


<div class="header">
<br></br>
<h2>#{userBean.accountInfo.firstname}'s Main Page</h2>
<br></br>
</div>


<div class="content">
   <br></br>
   <br></br>
   <br></br>
   <center>
   <h:outputLabel value="#{userBean.accountInfo.firstname}'s Generated College List " />
<br></br>
   <c:choose>  
      <c:when test="${empty userBean.resultList.college1}"> 
         <h:outputText value="No College List Generated"></h:outputText>
      </c:when>  
      <c:otherwise>  
         <table border="1">
         <tr>
            <th> Rank </th>
            <th> College </th>
            <th> Action Taken </th>
         </tr>
         <tr>
            <td> 1 </td>
            <td> #{userBean.resultList.college1} </td>
            <td> #{userBean.resultList.result1} </td>
         </tr>
         <tr>
            <td> 2 </td>
            <td> #{userBean.resultList.college2} </td>
            <td> #{userBean.resultList.result2} </td>
         </tr>
         <tr>
            <td> 3 </td>
            <td> #{userBean.resultList.college3} </td>
            <td> #{userBean.resultList.result3} </td>
         </tr>
         <tr>
            <td> 4 </td>
            <td> #{userBean.resultList.college4} </td>
            <td> #{userBean.resultList.result4} </td>
         </tr>
         <tr>
            <td> 5 </td>
            <td> #{userBean.resultList.college5} </td>
            <td> #{userBean.resultList.result5} </td>
         </tr>
         </table>
      </c:otherwise>  
   </c:choose>
</center>
<br></br><br></br>
</div>

<div class="footer">
<br></br>
<h3> College Decision Helper </h3>
<br></br>
</div>


<div class="menu">
<br></br>
<h:form id = "menuId">
<center>
   <h:commandButton value="Modify Info" 
                    action="#{navigationBean.modifyInfo}"/>
<br></br>
<br></br>
   <h:commandButton value="      Results      " 
                    action="#{navigationBean.displayResultList}"/>
<br></br>
<br></br>

   <h:commandButton value="      Logout      " 
                    onmousedown="fblogout();" 
                    action="#{mainBean.logout}"/>

<br></br>
<br></br>
</center>
</h:form>
</div>

</body>
</html>